<template>
  <div>
    <!-- 1.0 卡片布局 -->
    <Card :arr="colorArr" :list="cardList" />

    <!-- 2.0 首页折线图 -->
  </div>
</template>

<script>
import Card from './components/Crad.vue'

export default {
  components: { Card },
  data() {
    return {
      colorArr: ['#1296db', '#d4237a', '#1296db', '#1afa29'],
      cardList: [
        {
          id: 1,
          icon: 'icon-wenjian',
          text: '总订单',
          num: '102,400',
          url: require('../../assets/imgs/te.jpg')
        },
        {
          id: 2,
          icon: 'icon-Dollar',
          text: '总销售额',
          num: '102,400',
          url:
            'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
        },
        {
          id: 3,
          icon: 'icon-task',
          text: '今日订单数',
          num: '102,400',
          url:
            'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
        },
        {
          id: 4,
          icon: 'icon-renminbi',
          text: '今日销售额',
          num: '102,400',
          url:
            'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg'
        }
      ]
    }
  }
}
</script>

<style lang="less" scoped></style>
